Cookie
cookie
是客户端用来存储数据的,它既可以在客户端设置也可以在服务器端设置。cookie
会跟随任意HTTP
请求一起发送
Web Storage
html5
标准中的Web Storage
包括了两种存储方式:sessionStorage
和localStorage
sessionStorage
用于本地存储一个会话中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁。因此sessionStorage
仅仅是会话级别的存储
而localStorage
用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的
区别
Web Storage
和Cookie
相似都是客户端用来存储数据的,区别是它是为了更大容量存储设计的Cookie
的大小是受限的,最多只能存储4KB
的数据;并且每次你请求一个新的页面的时候,Cookie
都会被发送过去,这样无形中浪费了带宽;再有就是不安全,很容易被拦截者截取进行篡改Web Storage
拥有setItem
、getItem
、removeItem
、clear
等方法,不像cookie
需要自己封装setCookie
、getCookie
等方法
但是Cookie
也是不可以或缺的:Cookie
的作用是与服务器进行交互,作为HTTP
规范的一部分而存在 ,而Web Storage
仅仅是为了在本地存储数据而生
操作方法
-
setItem
sessionStorage.setItem("name","leoyaojy"); localStorage.setItem("website","luckyw.cn");
-
getItem
sessionStorage.getItem("name"); //leoyaojy localStorage.getItem("website"); //luckyw.cn
-
removeItem
sessionStorage.removeItem("name"); localStorage.removeItem("website");
-
clear
sessionStorage.clear(); localStorage.clear();
-
其他操作方法:
点操作
和[]
sessionStorage.name = "leoyaojy"; console.log(sessionStorage["name"]); localStorage["website"] = "luckyw.cn"; console.log(localStorage.website);
-
key()
和length
遍历数据for (var i=0, len = localStorage.length; i<len; i++){ var key = localStorage.key(i); var value = localStorage.getItem(key); console.log(key + "=" + value); }
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。